<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
  <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  <title>信息认证</title>
  <link rel="stylesheet" type="text/css" href="../css/api.css" />
  <link rel="stylesheet" type="text/css" href="../css/edit.css" />
</head>

<body>
  <div id="app" v-cloak>
    <div class="wrap flex-wrap flex-vertical">
      <header id="header">
        <div class="header-wrap">
          <div @click="goback" class="header-left">
            <i class="iconfont icon-pre"></i>
          </div>
          <h1 class="header-title">信息认证</h1>
        </div>
      </header>
      <div class="flex-con">
        <div class="edit-info">
          <div class="input-wrap border-bottom">
            <div class="label">微信账号</div>
            <input v-model="form.wechatID" type="text" placeholder="请填写微信账号">
          </div>
        </div>
        <div class="btn-wrap">
          <button @click="confirm" type="button" :disabled="isDisabled" :class="[!isDisabled ? 'btn-active' : 'btn']">提交认证申请</button>
        </div>
      </div>
    </div>
  </div>
</body>

</html>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/vue.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript">
  var app;
  apiready = function () {
    $api.fixStatusBar($api.dom('#header'));
    api.setStatusBarStyle({
      style: 'light',
    });
    app = new Vue({
      el: '#app',
      data: {
        form: {
          uid: $api.getStorage('uid'),
          wechatID: '',
        },
        isDisabled: true,
      },
      created: function () {},
      mounted: function () {},
      methods: {
        watchModel: function () {
          if (this.form.wechatID == '') {
            this.isDisabled = true;
          } else {
            this.isDisabled = false;
          }
        },
        //提交认证信息
        confirm: function () {
          var _this = this;
          if (_this.form.wechatID == '') {
            api.toast({
              msg: '请填写微信账号',
              duration: 2000,
              location: 'bottom'
            });
            return false;
          };
          api.ajax({
            url: baseUrl + 'certification/store',
            method: 'post',
            headers: {
              token: $api.getStorage('deviceToken')
            },
            data: {
              values: _this.form
            }
          }, function (ret, err) {
            if (ret.status == 200) {
              api.toast({
                msg: '提交成功，请耐心等待审核',
                duration: 2000,
                location: 'bottom'
              });
              api.sendEvent({
                name: 'refreshMy',
              });
              setTimeout(function () {
                api.closeWin();
              }, 1000);
            }
          })
        },
        // 后退
        goback: function () {
          api.closeWin();
        }
      },
      watch: {
        "form.wechatID": function () {
          this.watchModel()
        },
      }
    })
  }
</script>